<template>
  <div id="score-review">
        <div>
          <div class="search-content">
            <el-select
              v-model="searchContent.store_id"
              placeholder="选择店铺ID"
            >
              <el-option
                v-for="item in options"
                :key="item.store_id"
                :label="item.store_name"
                :value="item.store_id"
              >
              </el-option>
            </el-select>
            <el-input
              class="search-content-input"
              v-model="searchContent.store_nameHandWhite"
              placeholder="请输入店铺名称"
            ></el-input>

            <div class="putaway-time-wrapper">
              <span class="putaway-time-label">生效时间：</span>
              <el-date-picker
                v-model="searchContent.addTime"
                value-format="yyyy-MM-dd"
                type="daterange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
              >
              </el-date-picker>
            </div>
            <el-button type="primary" @click="search">搜索</el-button>
            <el-button type="primary" @click="resetSearchData">重置</el-button>
          </div>
          <div class="search-list">
            <el-table :data="groupList" border :height="oHeight">
              <el-table-column
                align="center"
                prop="id"
                label="ID"
                min-width="120"
              ></el-table-column>
              <el-table-column
                align="center"
                prop="store_name"
                label="店铺名称"
                min-width="120"
              ></el-table-column>
              <el-table-column
                align="center"
                prop="points_model"
                label="积分模式"
                min-width="120"
              >
                <template slot-scope="scope">
                  {{ scope.row.points_model == 1 ? "预支付" : "后结算" }}
                </template>
              </el-table-column>
              <el-table-column
                align="center"
                prop="amount"
                label="商家购买金额（万元）"
                min-width="120"
              >
                <template slot-scope="scope">
                  <span>{{ (scope.row.amount * 1).toFixed(6) }}</span>
                </template>
              </el-table-column>
              <el-table-column
                align="center"
                prop="money"
                label="平台赠送金额（万元）"
                min-width="120"
              >
                <template slot-scope="scope">
                  <span>{{
                    (scope.row.amount * scope.row.points_ratio).toFixed(6)
                  }}</span>
                </template>
              </el-table-column>
              <el-table-column
                align="center"
                prop="points_ratio"
                label="赠送比率"
                min-width="120"
              >
              </el-table-column>
              <el-table-column
                align="center"
                prop="start_date"
                label="开始时间"
                min-width="120"
              >
                <template slot-scope="scope">
                  <span>{{
                    (scope.row.start_date * 1000) | dateFormatter("YYYY-MM-DD ")
                  }}</span>
                </template>
              </el-table-column>
              <el-table-column
                align="center"
                prop="end_date"
                label="结束时间"
                min-width="120"
              >
                <template slot-scope="scope">
                  <span>{{
                    (scope.row.end_date * 1000) | dateFormatter("YYYY-MM-DD ")
                  }}</span>
                </template>
              </el-table-column>
              <el-table-column
                align="center"
                prop="update_time"
                label="关闭时间"
                min-width="120"
              >
                <template slot-scope="scope">
                  <span>{{
                    (scope.row.update_time * 1000)
                      | dateFormatter("YYYY-MM-DD ")
                  }}</span>
                </template>
              </el-table-column>
              <el-table-column
                align="center"
                prop="store_add_points"
                label="累计购买充值积分"
                min-width="120"
              >
              </el-table-column>
              <el-table-column
                align="center"
                prop="cjj_add_points"
                label="累计赠送充值积分"
                min-width="120"
              >
              </el-table-column>
              <el-table-column
                align="center"
                prop="remindPoint"
                label="剩余积分"
                min-width="120"
              >
                <template slot-scope="scope">
                  <span>{{
                    (
                      (scope.row.amount * 10000 +
                        scope.row.amount * scope.row.points_ratio * 10000) *
                        100 -
                      scope.row.cjj_add_points -
                      scope.row.store_add_points
                    ).toFixed(0)
                  }}</span>
                </template>
              </el-table-column>
              <el-table-column
                align="center"
                prop="config_type"
                label="配送类别"
                min-width="120"
              >
              </el-table-column>
              <el-table-column
                fixed="right"
                align="center"
                label="操作"
                key="operate"
                width="120"
              >
                <template slot-scope="scope">
                <!-- review:0 未审核 review:1已审核 -->
                  <el-button
                    v-show="scope.row.review && scope.row.review == 1||scope.row.review == 0"
                    class="operateBtn"
                    :disabled="scope.row.review == 1"
                    type="text"
                    @click="reviewTable(scope.row.id)"
                    >审核</el-button
                  >
                </template>
              </el-table-column>
            </el-table>
            <div class="bottom">
              <div></div>
              <!--分页部分-->
              <div class="paginationOne">
                <el-pagination
                  @size-change="handleSizeChange"
                  @current-change="handleCurrentChange"
                  :current-page="searchContent.currentPage"
                  :page-sizes="[10, 20, 50, 100]"
                  :page-size="searchContent.pageSize"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="total"
                >
                </el-pagination>
              </div>
            </div>
          </div>
        </div>
  </div>
</template>
<script>
import { resize } from "@/common/js/height.js";
import { dateFormatter } from "../../../../common/js/util";

export default {
  data() {
    return {
      options: [],
      oHeight: 800,
      searchContent: {
        addTime: "",
        amount: "",
        cjj_add_points: "",
        config_type: "",
        id: "",
        is_open: "",
        points_model: "",
        points_ratio: "",
        start_date: "",
        store_add_points: "",
        store_id: "",
        store_nameHandWhite: "",
        update_time: "",
        currentPage: 1,
        pageSize: 10,
      },
      groupList: [],

      total: 0,
    };
  },
  created() {
    this.getList();
    this.getStoreListFun();
  },

  methods: {
    // 选店铺id的列表
    getStoreListFun() {
      this.$http
        .post("/admin/points/index.php?act=points_config&op=getStroeList")
        .then((res) => {
          if (res.code == 1) {
            if (res.data) {
              this.options = res.data.list;
            } else {
              this.goodsList = [];
            }
          } else if (res.code == 2001) {
            this.goodsList = [];
          } else {
            alert(res.msg);
          }
        });
    },
    handleSizeChange(pageSize) {
      this.searchContent.pageSize = pageSize;
      this.searchContent.currentPage = 1;
      this.getList();
    },
    handleCurrentChange(page) {
      this.searchContent.currentPage = page;
      this.getList();
    },
    resetSearchData() {
      this.searchContent.export = "";
      this.searchContent.state = "";
      this.searchContent.store_nameHandWhite = "";
      this.searchContent.store_id = "";
      this.searchContent.addTime = "";
    },

    ////// 店铺详情总列表
    getList() {
      const data = {};
      data.page = this.searchContent.currentPage;
      data.eachNum = this.searchContent.pageSize;
      data.store_id = this.searchContent.store_id;
      data.store_name = this.searchContent.store_nameHandWhite;
      if (this.searchContent.addTime) {
        data.start_date = dateFormatter(
          "YYYY-MM-DD 00:00:00",
          this.searchContent.addTime[0]
        );
        data.end_date = dateFormatter(
          "YYYY-MM-DD 23:59:59",
          this.searchContent.addTime[1]
        );
      }
      this.$http
        .post("/admin/points/index.php?act=points_config&op=getList", data)
        .then((res) => {
          if (res.code == 1) {
            if (res.data) {
              this.groupList = res.data.list;
              this.total = parseInt(res.data.totalNum);
            } else {
              this.groupList = [];
              this.total = 0;
            }
          } else if (res.code == 2001) {
            this.groupList = [];
            this.total = 0;
          } else {
            alert(res.msg);
          }
        });
    },
    reviewTable(id){
        this.$http.post("/admin/points/index.php?act=points_config&op=review",{id}).then(res=>{
            console.log(res,'res');
            if(res.code == 1){
                this.$message.success(res.msg);
                this.getList();
            }else{
                this.$message.error(res.msg);
            }
        })
    },
    search() {
      this.getList();
    },
  },
  mounted() {
    resize(this);
  },
};
</script>
<style lang="scss" scoped>
.search-content {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  &-input {
    width: 200px;
  }
  .putaway-time-wrapper {
    .putaway-time-label {
      font-size: 14px;
    }
    display: flex;
    align-items: center;
    /deep/.el-range-separator {
      box-sizing: content-box;
    }
  }
}
.bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
</style>